
<form action="{url('', $urlParams)}" data-dux="form-bind" method="post" data-callback="submit" data-advanced="false">
    <!--if{!empty($addInfo)}-->
    <div class="dux-box-address-fixed">
        <div class="dux-box-address">
            <a href="{url('order/Address/index', ['action' => url('', $urlParams)])}">
                <div>{$addInfo.name} {$addInfo.tel}</div>
                <p class="uk-text-truncate">{$addInfo.province}{$addInfo.city}{$addInfo.region}{$addInfo.address}</p>
            </a>
        </div>
    </div>
    <!--{else}-->
    <div class="dux-box-address-fixed">
        <div class="dux-box-address">
            <a href="{url('order/Address/add', ['action' => url('', $urlParams)])}">
                <div class="uk-text-danger">请添加收货地址</div>
                <p class="uk-text-truncate">首次购买请添加收货地址</p>
            </a>
        </div>
    </div>
    <!--{/if}-->

    <!--loop{$cartData as $k => $data}-->
    <div class="store-item">
        <div class="dux-box dux-pro-list">
            <!--loop{$data.items as $key => $vo}-->
            <div class="dux-pro-item">
                <div class="item-img">
                    <img src="{$vo.image}" width="90" height="90">
                </div>
                <div class="item-info">
                    <div class="title">{$vo.name}</div>
                    <!--if{!empty($vo.options)}-->
                    <p class="uk-margin-small-top uk-text-truncate">
                        <!--loop{$vo.options as $i => $v}-->{$i ? ',': ''} {$v.value}<!--{/loop}-->
                    </p>
                    <!--{/if}-->
                    <div class="dux-flex uk-margin-small-top">
                        <div class="flex-1 uk-text-danger">￥{price_format($vo.price)}</div>
                        <div class="uk-text-right">x{$vo.qty}</div>
                    </div>
                </div>
            </div>
            <!--{/loop}-->

        </div>

        <ul class="dux-menu-list">
            <li>
                <a href="javascript:;" data-coupon="" data-price="{$data.order_price}" data-ids="{$data.ids}" data-app="{$data.app}">
                    <div class="title">
                        优惠券
                    </div>
                    <div class="more more-right uk-text-right" data-coupon-text>
                        不使用优惠券
                    </div>
                </a>
                <input name="coupon_id[{$k}]"  data-coupon-input type="hidden">

                <div class="dux-popup-fixed" data-coupon-popup>
                    <div class="dux-popup ">
                        <div class="popup-title">
                            <h4 class="title">可用优惠券</h4>
                            <span class="close" data-close>&times;</span>
                        </div>

                        <div class=" popup-body">
                            <ul class="dux-menu-list">
                                <li>
                                    <a href="javasctipt:;" data-id="0" data-name="不使用优惠券">
                                        <div class="title">
                                            不使用优惠券
                                        </div>
                                        <div class="more more-right"></div>
                                    </a>
                                </li>
                                <li class="list-interval">
                                    可用优惠券
                                </li>
                                <li>
                                    <!--loop{$data.coupon as $vo}-->
                                    <a href="javascript:;" data-id="{$vo.log_id}"
                                       data-name="满{$vo.meet_money}减{$vo.money}"
                                       data-price="{$vo.money}">
                                        <div class="title">
                                            {$vo.name}
                                            <p>满{$vo.meet_money}减{$vo.money}</p>
                                        </div>
                                        <div class="more more-right"></div>
                                    </a>
                                    <!--{/loop}-->
                                </li>

                            </ul>

                        </div>
                    </div>
                </div>

            </li>

            <li>
                <a href="javascript:;" data-delivery="" data-price="{$data.delivery_price}">
                    <div class="title">配送服务</div>
                    <div class="more more-right uk-text-right" data-text="快递 {$data.delivery_price ? $data.delivery_price.'运费' : '免运费'}">
                        快递 {$data.delivery_price ? $data.delivery_price.'运费' : '免运费'}
                    </div>
                </a>
                <input name="take_id[{$k}]" type="hidden">
            </li>



            <!--if{$orderConfig.cod_status}-->
            <li>
                <a href="javascript:;" data-cod="">
                    <div class="title">付款方式</div>
                    <div class="more more-right">
                        {$codStatus ? '货到付款' : '在线支付'}
                    </div>
                </a>
                <input name="cod_status[{$k}]" type="hidden" value="0">
            </li>
            <!--{/if}-->
            <!--if{$data.invoice_status}-->
            <li>
                <a href="javascript:;" data-invoice="">
                    <div class="title">
                        发票类型
                    </div>
                    <div class="more more-right uk-text-right" data-text>
                        无需发票
                    </div>
                </a>
                <input name="invoice[{$k}]" type="hidden">
            </li>
            <!--{/if}-->
            <li>
                <a href="javascript:;" data-invoice-top="" data-invoice-info style="display: none">
                    <div class="title">
                        抬头类型
                    </div>
                    <div class="more more-right uk-text-right" data-text>
                        个人
                    </div>
                </a>
                <input name="invoice_type[{$k}]" type="hidden">
            </li>
            <li>
                <a href="javascript:;" data-invoice-class="" data-invoice-info style="display: none">
                    <div class="title">
                        发票内容
                    </div>
                    <div class="more more-right uk-text-right" data-text>
                        请选择
                    </div>
                </a>
                <input name="invoice_class[{$k}]" type="hidden">
            </li>
        </ul>
        <div data-invoice-info style="display: none">
        <div class="dux-form uk-form   dux-form dux-form-right" data-invoice-personal>
            <div class="uk-input-group">
                <span class="uk-input-group-label">发票抬头</span>
                <input type="text" class="uk-form-field" placeholder="请输入发票抬头，如：姓名" name="invoice_name[{$k}]" value="">
            </div>
        </div>
        <div class="dux-form uk-form   dux-form dux-form-right" data-invoice-enterprise style="display: none">
            <div class="uk-input-group">
                <span class="uk-input-group-label">发票抬头</span>
                <input type="text" class="uk-form-field" placeholder="请输入发票抬头，如：企业名称" name="invoice_name[{$k}]" value="">
            </div>
            <div class="uk-input-group">
                <span class="uk-input-group-label">添加税号</span>
                <input type="text" class="uk-form-field" placeholder="请输入纳税人识别号" name="invoice_label[{$k}]" value="">
            </div>
        </div>
        </div>

        <div class="dux-form uk-form   dux-form dux-form-right">
            <div class="uk-input-group">
                <span class="uk-input-group-label">买家留言</span>
                <input type="text" class="uk-form-field" placeholder="选填，给商家留言" name="remark[{$k}]" value="">
            </div>
        </div>
        <ul class="dux-box uk-padding-small uk-margin-remove-top dux-row-list">
            <li>
                <div class="uk-text-right">
                    共<span class="uk-text-danger">{$data.order_sum}</span>件商品
                    合计:<span class="uk-text-danger" data-order-price="{$data.order_price}">￥{$data.order_price}</span>
                    运费:<span class="uk-text-danger" data-delivery-price="{$data.delivery_price}">￥{$data.delivery_price}</span>
                    优惠:<span class="uk-text-danger" data-discounts-price="0">￥0</span>
                </div>
            </li>
        </ul>
    </div>
    <!--{/loop}-->

    <ul class="dux-box uk-padding-small dux-row-list">
        <li>
            <div>商品总额</div>
            <div class="uk-text-right uk-text-danger" data-total-price="{$orderPrice}">￥{$orderPrice}</div>
        </li>
        <li>
            <div>运费</div>
            <div class="uk-text-right uk-text-danger" data-total-delivery="{$deliveryPrice}">{$deliveryPrice ? '+' : ''} ￥{$deliveryPrice}</div>
        </li>
        <li>
            <div>优惠</div>
            <div class="uk-text-right uk-text-danger" data-total-discounts="{$discountsPrice}">{$discountsPrice ? '-' : ''} ￥{$discountsPrice}</div>
        </li>
        <!--loop{$currencyAppend as $vo}-->
        <li>
            <div>{$vo.name}</div>
            <div class="uk-text-right uk-text-danger">{$vo.money}</div>
        </li>
        <!--{/loop}-->
        <li>
            <div>支付总额</div>
            <div class="uk-text-right uk-text-large">
                <span class="uk-text-danger" data-total="{$totalPrice}">￥{$totalPrice}</span>
                <!--loop{$currencyAppend as $vo}-->
                <p class="uk-text-small">+{$vo.money}{$vo.name}</p>
                <!--{/loop}-->
            </div>
        </li>
    </ul>

    <!--if{$currencyExchange}-->
    <div class="uk-padding-small uk-text-shallow uk-text-small">
        提示：结算后支付时使用以下支付将抵扣部分消费
    </div>
    <ul class="dux-box uk-padding-small dux-menu-list uk-margin-remove-top">
        <!--loop{$currencyExchange as $vo}-->
        <li class="uk-padding-small-xs dux-flex">
            <span>{$vo.name}</span>
            <span class="flex-1 uk-text-danger uk-text-right">
                {$vo.rate_money} {$vo.name} 抵扣 1 元
            </span>
        </li>
        <!--{/loop}-->
    </ul>

    <!--loop{$currencyExchange as $vo}-->
    <div class="uk-padding-small  uk-text-shallow uk-text-small">
        {$vo.name}说明：
        <!--if{$vo.min_limit}-->
        最少可用{$vo.min_limit}{$vo.name}
        <!--{/if}-->
        <!--if{$vo.max_limit}-->
        最多可用{$vo.max_limit}{$vo.name}
        <!--{/if}-->
        使用{$vo.name}抵扣将会按照实际支付额进行抵扣
    </div>
    <!--{/loop}-->
    <!--{/if}-->
    <div class="uk-padding-small">
        <button type="submit" class="uk-button uk-button-primary uk-button-block uk-button-large" data-submit {$addInfo ?
        '' : 'disabled'}>结 算</button>
    </div>
</form>



<script type="text/html" id="pay-tpl">
    <div class="dux-popup-fixed">
        <div class="dux-popup ">
            <div class="popup-title">
                <div class="title">付款方式</div>
                <a href="javascript:;" class="close" data-close>&times;</a>
            </div>
            <div class="popup-body">
                <ul class="dux-menu-list">
                    <li><a href="javascript:;" data-status="0" data-name="在线支付">在线支付</a></li>
                    <li><a href="javascript:;" data-status="1" data-name="货到付款">货到付款</a></li>
                </ul>
            </div>
        </div>
    </div>
</script>

<script type="text/html" id="delivery-tpl">
    <div class="dux-popup-fixed">
        <div class="dux-popup ">
            <div class="popup-title">
                <h4 class="title">配送服务</h4>
                <span class="close" data-close>&times;</span>
            </div>
            <div class=" popup-body">
                <ul class="dux-menu-list">
                    <li>
                        <a href="javascript:;" data-id="0" data-name="{{d.freight.text}}" data-price="{{d.freight.price}}">
                            <div class="title">
                                <span>{{d.freight.text}}</span>
                                <p>付款后72小时内发货</p>
                            </div>
                            <div class="more more-right"></div>
                        </a>
                    </li>
                    {{# if(d.takeList.length) { }}
                    <li class="list-interval">
                        自提点
                    </li>
                    {{# for(var i in d.takeList){ }}
                    <li>
                        <a href="javascript:;" data-id="{{d.takeList[i].take_id }}" data-name="{{d.takeList[i].name }}" data-price="0">
                            <div class="title">
                                <span class="uk-label uk-label-primary">自提</span> {{d.takeList[i].name }}
                                <p>{{d.takeList[i].city }}{{d.takeList[i].region }}{{d.takeList[i].address }}</p>
                            </div>
                            <div class="more more-right"></div>
                        </a>
                    </li>
                    {{# } }}
                    {{# } }}
                </ul>
            </div>
        </div>
    </div>
</script>

<script type="text/html" id="invoice-tpl">
    <div class="dux-popup-fixed">
        <div class="dux-popup ">
            <div class="popup-title">
                <h4 class="title">发票类型</h4>
                <span class="close" data-close>&times;</span>
            </div>
            <div class=" popup-body">
                <ul class="dux-menu-list">
                    <li>
                        <a href="javascript:;" data-type="0" data-name="无需发票">
                            <div class="title">
                                无需发票
                            </div>
                            <div class="more more-right"></div>
                        </a>
                    </li>
                    <li>
                        <a href="javascript:;" data-type="1" data-name="纸质发票">
                            <div class="title">
                                纸质发票
                            </div>
                            <div class="more more-right"></div>
                        </a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</script>

<script type="text/html" id="invoice-top-tpl">
    <div class="dux-popup-fixed">
        <div class="dux-popup ">
            <div class="popup-title">
                <h4 class="title">发票抬头</h4>
                <span class="close" data-close>&times;</span>
            </div>
            <div class=" popup-body">
                <ul class="dux-menu-list">
                    <li>
                        <a href="javascript:;" data-type="0" data-name="个人">
                            <div class="title">
                                个人
                            </div>
                            <div class="more more-right"></div>
                        </a>
                    </li>
                    <li>
                        <a href="javascript:;" data-type="1" data-name="企业">
                            <div class="title">
                                企业
                            </div>
                            <div class="more more-right"></div>
                        </a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</script>

<script type="text/html" id="invoice-class-tpl">
    <div class="dux-popup-fixed">
        <div class="dux-popup ">
            <div class="popup-title">
                <h4 class="title">发票内容</h4>
                <span class="close" data-close>&times;</span>
            </div>
            <div class=" popup-body">
                <ul class="dux-menu-list">
                    <!--loop{$invoiceClass as $vo}-->
                    <li>
                        <a href="javascript:;" data-type="{$vo.class_id}" data-name="{$vo.name}">
                            <div class="title">
                                {$vo.name}
                            </div>
                            <div class="more more-right"></div>
                        </a>
                    </li>
                    <!--{/loop}-->
                </ul>
            </div>
        </div>
    </div>
</script>

<script>
    Do('base', 'tpl', function () {
        $('[data-cod]').on('click', function () {
            var tpl = $('#pay-tpl').html();
            var input = $(this).next('input');
            var text = $(this).find('[data-text]');
            laytpl(tpl).render({}, function (html) {
                var deliveryEl = $(html).appendTo('body');
                show.popup(deliveryEl, {
                    callback : function () {
                        $(this).remove();
                    }
                });
                $(deliveryEl).on('click', 'a', function () {
                    var status = $(this).data('status');
                    var name = $(this).data('name');
                    input.val(status);
                    text.html(name);
                    show.popup.close(deliveryEl);
                });
            });
        });


        $('[data-invoice]').on('click', function () {
            var input = $(this).next('input');
            var tpl = $('#invoice-tpl').html();
            var text = $(this).find('[data-text]');
            var itemDiv = $(this).parents('.store-item');
            laytpl(tpl).render({}, function (html) {
                var deliveryEl = $(html).appendTo('body');
                show.popup(deliveryEl, {
                    callback : function () {
                        $(this).remove();
                    }
                });
                $(deliveryEl).on('click', 'a', function () {
                    var type = $(this).data('type');
                    var name = $(this).data('name');
                    input.val(type);
                    text.html(name);
                    if(type == 0) {
                        itemDiv.find('[data-invoice-info]').hide();
                    }else {
                        itemDiv.find('[data-invoice-info]').show();
                    }
                    show.popup.close(deliveryEl);
                });
            });
        });
        $('[data-invoice-top]').on('click', function () {
            var input = $(this).next('input');
            var tpl = $('#invoice-top-tpl').html();
            var text = $(this).find('[data-text]');
            var itemDiv = $(this).parents('.store-item');
            laytpl(tpl).render({}, function (html) {
                var deliveryEl = $(html).appendTo('body');
                show.popup(deliveryEl, {
                    callback : function () {
                        $(this).remove();
                    }
                });
                $(deliveryEl).on('click', 'a', function () {
                    var type = $(this).data('type');
                    var name = $(this).data('name');
                    input.val(type);
                    text.html(name);
                    itemDiv.find('[data-invoice-personal]').hide();
                    itemDiv.find('[data-invoice-enterprise]').hide();
                    if(type == 0) {
                        itemDiv.find('[data-invoice-personal]').show();
                    }else {
                        itemDiv.find('[data-invoice-enterprise]').show();

                    }
                    show.popup.close(deliveryEl);
                });
            });
        });
        $('[data-invoice-class]').on('click', function () {
            var input = $(this).next('input');
            var tpl = $('#invoice-class-tpl').html();
            var text = $(this).find('[data-text]');
            laytpl(tpl).render({}, function (html) {
                var deliveryEl = $(html).appendTo('body');
                show.popup(deliveryEl, {
                    callback : function () {
                        $(this).remove();
                    }
                });
                $(deliveryEl).on('click', 'a', function () {
                    var type = $(this).data('type');
                    var name = $(this).data('name');
                    input.val(type);
                    text.html(name);
                    show.popup.close(deliveryEl);
                });
            });
        });

        $('[data-delivery]').on('click', function () {
            var input = $(this).next('input');
            var text = $(this).find('[data-text]');
            var itemDiv = $(this).parents('.store-item');
            var deliveryPrice = $(this).data('price');
            app.ajax({
                url: "{url('order/Cart/take')}",
                success: function (data) {
                    var tpl = $('#delivery-tpl').html();
                    data.freight = {
                        text : text.data('text'),
                        price : deliveryPrice
                    };
                    laytpl(tpl).render(data, function (html) {
                        var deliveryEl = $(html).appendTo('body');
                        show.popup(deliveryEl, {
                            callback : function () {
                                $(this).remove();
                            }
                        });
                        $(deliveryEl).on('click', 'a', function () {
                            var id = $(this).data('id');
                            var name = $(this).data('name');
                            var price = $(this).data('price');
                            itemDiv.find('[data-delivery-price]').text('￥' + price);
                            itemDiv.find('[data-delivery-price]').data('deliveryPrice', price);
                            input.val(id);
                            text.html(name);
                            totalPrice();
                            show.popup.close(deliveryEl);
                        });
                    });
                }
            });
        });


        $('[data-coupon-popup]').on('click', 'a', function () {

            var itemDiv = $(this).parents('.store-item');
            var orderPrice = parseFloat($(this).data('price'));
            var input = itemDiv.find('[data-coupon-input]');
            var text = itemDiv.find('[data-coupon-text]');

            var id = $(this).data('id');
            var name = $(this).data('name');
            var price = parseFloat($(this).data('price'));
            price = price ? price : 0;
            itemDiv.find('[data-discounts-price]').text('￥' + price);
            itemDiv.find('[data-discounts-price]').data('discountsPrice', price);
            input.val(id);
            text.html(name);
            totalPrice();
            show.popup.close($(this).parents('[data-coupon-popup]'));
        });


        $('[data-coupon]').on('click', function () {
            var deliveryEl = $(this).parents('li').find('[data-coupon-popup]');
            show.popup(deliveryEl);
        });

        var totalPrice = function () {
            var orderPrice = 0;
            var discountsPrice = 0;
            var deliveryPrice = 0;
            $('[data-order-price]').each(function () {
                orderPrice += parseFloat($(this).data('orderPrice'));
            });
            $('[data-discounts-price]').each(function () {
                discountsPrice += parseFloat($(this).data('discountsPrice'));
            });
            $('[data-delivery-price]').each(function () {
                deliveryPrice += parseFloat($(this).data('deliveryPrice'));
            });
            $('[data-total-price]').text( '￥' + orderPrice.toFixed(2));
            $('[data-total-discounts]').text((discountsPrice ? '-' : '') + '￥' + discountsPrice.toFixed(2));
            $('[data-total-delivery]').text((deliveryPrice ? '+' : '') + '￥' + deliveryPrice.toFixed(2));
            $('[data-total]').text('￥' + (orderPrice + deliveryPrice - discountsPrice).toFixed(2));
        };


        window.submit = function (msg, url) {
            window.location.href = url;
        };
    });
</script>
